﻿<div class="tt-attach">
    <ul class="op">
        <li></li>
    </ul>
</div> 
<div class="col-mains">
    <div class="col-left">
        <div class="main-wrap box-sub" style="width:515px; height:100%;overflow:hidden;" id="treePart">
            <ul id="tree" style=" width:515px; overflow:hidden ">
            </ul>
        </div>
    </div>
    <div class="col-right">
        <div class="box-sub hidden" id="infoPart">
            <h5 class="btn-userins">
                当前区域信息</h5>
            <div class="tip-alert-box ">
                <table class="tbl-info ">
                    <tbody>
                        <tr>
                            <th>
                                唯一标识：
                            </th>
                            <td id="institutionID">
                            </td>
                        </tr>
                        <tr>
                            <th>
                                区域名称：
                            </th>
                            <td id="institutionName">
                            </td>
                        </tr>
                        <tr>
                            <th>
                                区域编码：
                            </th>
                            <td id="institutionNo">
                            </td>
                        </tr>
                        <tr>
                            <th>
                                标识路径：
                            </th>
                            <td id="institutionIDPath">
                            </td>
                        </tr>
                        <tr>
                            <th>
                                名称路径：
                            </th>
                            <td id="institutionNamePath">
                            </td>
                        </tr>
                        <tr>
                            <th>
                                层级：
                            </th>
                            <td id="institutionLevel">
                            </td>
                        </tr>
                        <tr>
                            <th>
                                状态：
                            </th>
                            <td id="institutionStatus">
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2" style="text-align: center; padding: 5px;">
                                @Html.ActionLink("添加子区域", "Create", new { id = ViewBag.TypeID }, new { id = "btnInsert", onclick = "Tree.Create(this);return false;", @class = "btn-add" })
                                @Html.ActionLink("修改当前区域", "Edit", new { id = ViewBag.TypeID }, new { id = "btnEdit", onclick = "Tree.Edit(this);return false;", @class = "btn-edit" })
                                @Html.ActionLink("删除当前区域", "Delete", new { id = ViewBag.TypeID }, new { id = "btnRemove", onclick = "Tree.Delete(this);return false;", @class = "btn-del" })
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="box-sub">
            <h5 id="btip" class="btn-tip">
                提示</h5>
            <ul class="s001 m">
                <li>当选中的区域包含子区域时，不能删除选中区域。</li>
            </ul>
        </div>
    </div>
</div>
@Html.Hidden("treeDataUrl", Url.Action("TreeData", new { id = ViewBag.TypeID }))
@Html.Hidden("moveUrl", Url.Action("Move", new { id = ViewBag.TypeID }))
@Html.Hidden("dataUrl", Url.Action("InstitutionData", new { id = ViewBag.TypeID }))
<script type="text/javascript">
    var Tree = {};
    Tree.Loaded = false;
    $(document).ready(function () {
        if (Tree.Loaded) {
            return;
        }
        Tree.Loaded = true;

        //设置树宽度及滚动条
        $("#tree").height($(document).height() - 160 - $(".pg-footer").height() - 70 - 40);
        $("#tree").css("overflow-y", "auto");

        $("#tree").tree({
            dnd: true,
            url: $("#treeDataUrl").val() + "?r=" + Math.random(),
            onClick: function (node) {
                //切换区域展开状态
                $(this).tree('expand', node.target);

                //呈现区域信息
                Tree.Show(node);
            },
            onDrop: function (target, source, point) {
                var target = $('#tree').tree("getNode", target);
                if (target.id == 0 && point != "append") {
                    $('#tree').tree("reload");
                    alert("区域不可与顶级节点同级！");
                    return false;
                }
                Tree.Move(source, target, point);
            }
        });
    });

    Tree.Back = function (e) {
        Common.CloseTab();
    };
    Tree.Show = function (node) {
        $.getJSON($("#dataUrl").val(), { institutionID: node.id }, function (data) {
            $("#institutionName").text(data.InstitutionName);
            $("#institutionNo").text(data.InstitutionNo);
            $("#institutionID").text(data.UID);
            $("#institutionIDPath").text(data.IDPath);
            $("#institutionNamePath").text(data.NamePath);
            $("#institutionLevel").text(data.InstitutionLevel);
            $("#institutionStatus").text(data.StateCodeID == 1 ? "启用" : "禁用");
            $("#infoPart").show();

            //判断是否有子区域
            if (data.HasChild) $("#btnRemove").hide();
            else $("#btnRemove").show();
            if (data.UID == 0) {
                $("#btnRemove").hide();
                $("#btnEdit").hide();
            }
            else
                $("#btnEdit").show();
        });
    };
    Tree.Create = function (e) {
        var selected = $('#tree').tree("getSelected");
        if (selected == null) {
            alert("没有找到选中区域，请先选中一个区域！");
            return;
        }

        $.createWin({ url: e.href + "?institutionID=" + selected.id, width: 600, height: 250, title: '添加子区域' });
    };
    Tree.Edit = function (e) {
        var selected = $('#tree').tree("getSelected");
        if (selected == null) {
            alert("没有找到选中区域，请先选中需要编辑的区域！");
            return;
        }

        $.createWin({ url: e.href + "?institutionID=" + selected.id, width: 600, height: 350, title: '修改区域' });
    };
    Tree.Delete = function (e) {
        if (!confirm("确认要删除吗？"))
            return;

        var selected = $('#tree').tree('getSelected');
        if (selected == null) {
            alert("请选中要删除的区域。");
            return;
        }

        $.post(e.href + "?institutionID=" + selected.id, {}, function (data) { 
            if (data.IsOK) {
           
                var parent = $('#tree').tree('getParent', selected.target);
                $('#tree').tree('remove', selected.target);
                $('#tree').tree('select', parent.target);
                Tree.Show(parent);
            }
            else {
                alert(data.Description);
            }
        });
    };
    Tree.Move = function (source, target, point) {
        var url = $("#moveUrl").val();
        var pointID = 0;
        if (point == "append") pointID = 1;
        else if (point == "top") pointID = 2;
        else if (point == "bottom") pointID = 3;
        var postData = { movedID: source.id, targetID: target.id, moveType: pointID };
        $.post(url, postData, function (data) {
            if (data.IsOK) {
                alert("区域移动成功。");
            }
            else {
                alert(data.Description);
                $('#tree').tree('reload');
            }
        });
    };
</script>
